<template>
  <div>
    <div class="pagination" style="margin-top: 20px">
      <span class="total-size">总共{{totalSize}}条信息</span>
      <el-pagination v-if="totalSize"
                     background
                     :page-size="pageSize"
                     :current-page="cur"
                     layout="prev, pager, next"
                     :total="totalSize"
                     @current-change="changePageNumber"
                     class="mt-4">
      </el-pagination>
    </div>
  </div>
</template>

<script>
  export default {
    name: "MyPagination",
    props: {
      totalSize: {
        type: Number,
        default() {
          return 0
        }
      },
      totalPage: {
        type: Number,
        default() {
          return 1
        }
      },
      pageSize: {
        type: Number,
        default() {
          return 1
        }
      },
      cur: {
        type: Number,
        default() {
          return 1
        }
      }
    },
    methods: {
      changePageNumber(cur) {
        console.log(cur);
        this.$bus.emit("changePageNumber", cur)
      }
    }
  }
</script>

<style scoped>
  .pagination {
    display: flex;
    justify-content: flex-end;
    margin-right: 100px;
  }
  .total-size {
    line-height: 36px;
    margin-right: 35px;
  }
</style>